<template>
  <div class="home">
    Welcome to Your Vue.js App
    <div class="title"> Mock 数据 </div>
    <template v-for="(item, index) in mockUser">
      <div :key="index">
        <span> {{item}} </span>
      </div>
    </template>
    <div class="title"> API 数据 </div>
    <template v-for="(item, index) in apiUser">
      <div :key="index">
        <span> {{item}} </span>
      </div>
    </template>
  </div>
</template>

<script>
// @ is an alias to /src
import { getUserInfo } from '../api/api'
import { getUserInfos } from '@/api/mock'

export default {
  name: 'Home',
  data(){
    return {
      mockUser: {},
      apiUser: {}
    }
  },
  components: {
  },
  mounted() {
    let that = this
    getUserInfo().then((res)=>{
      that.apiUser = res[0]
    })
    getUserInfos().then((res) => {
      that.mockUser = res.data
    })
  },
}
</script>
<style lang="less" scoped>
.title{
  text-align: left;
}
</style>
